let data = {};
let editingId = null;
let requestUrl = null;
let statusArray = ["未镶嵌", "已镶嵌"];

function addHandler() {
	requestUrl = "/wenshi/insert";

	$("#wenshi_dialog").dialog("open");
}

function editHandler() {
	let rowData = $("#wenshi_list").datagrid("getSelected");

	if(rowData) {
		requestUrl = "/wenshi/updateById";

		$("#id").val(rowData.id);
		$("#roleId").combogrid("setValue", rowData.roleId);
		$("#zuoqiId").combobox("setValue", rowData.zuoqiId);
		$("#categoryId").combobox("setValue", rowData.categoryId);
		$("#durability").numberspinner("setValue", rowData.durability);

		$("#wenshi_dialog").dialog("open");
	} else {
		alertMsg("请选择要修改的记录！");
	}
}

function attributeHandler() {
	let rowData = $("#wenshi_list").datagrid("getSelected");
	
	if(rowData) {
		$("#property_list").datagrid("reload", {
			wenshiId: rowData.id
		});
		
		$("#property_dialog").dialog("open");
	} else {
		alertMsg("请选择一条记录！");
	}
}

function viewHandler() {
	let rowData = $("#wenshi_list").datagrid("getSelected");

	if(rowData) {
		let wenshiId = rowData.id;

		ajaxGet("/wenshi/selectDetail", {
			wenshiId: wenshiId
		}, function(resp) {
			let data = resp.data;

			$("#wenshi_image").prop("src", data.image);
			$("#wenshi_name").html(data.name);
			$("#wenshi_attribute").empty();

			ajaxGet("/wenshi_attribute/selectAttributes", {
				wenshiId: wenshiId
			}, function(resp) {
				let data = resp.data;
				let content = "";

				for(let i = 0; i < data.length; i++) {
					content += "&emsp;<span>" + data[i] + "</span><br />"
				}

				$("#wenshi_attribute").append(content);
			}, error);

			$("#wenshi_durability").html(data.durability);

			ajaxGet("/wenshi_type/selectById", {
				id: data.type
			}, function(resp) {
				let data = resp.data;
				
				$("#wenshi_note").html(data.note);
			}, error);

			$("#wenshi_detail").dialog("open");
		}, error);
	} else {
		alertMsg("请选择一条记录！", "warning");
	}
}

function cloneHandler() {
	let rowData = $("#wenshi_list").datagrid("getSelected");

	if (rowData) {
		ajaxPost("/wenshi/clone", {
			wenshiId: rowData.id
		}, function(resp) {
			showMsg(resp.message);

			$("#wenshi_list").datagrid("reload");
		}, error);
	} else {
		alertMsg("请选择要克隆的数据！", "warning");
	}
}

function deleteHandler() {
	let rowData = $("#wenshi_list").datagrid("getSelected");

	if(rowData) {
		$.messager.confirm("提示", "是否确认删除？", function(bool) {
			if (bool) {
				ajaxPost("/wenshi/deleteById", {
					id: rowData.id
				}, function(resp) {
					showMsg(resp.message);

					$("#wenshi_list").datagrid("reload");
				}, error);
			}
		});
	} else {
		alertMsg("请选择要删除的记录！", "warning");
	}
}

$(document).ready(function() {

	$("#categoryId").combobox({
		url: "/wenshi_category/selectAll",
        valueField: "id",
		textField: "name",
		width: 150,
		required: true,
		editable: true,
		panelHeight: "auto",
		formatter: function(row) {
			return "<img width='18' src='" + row.image + "' />&nbsp;" + row.name;
		}
	});
	
	$("#durability").numberspinner({
        min: 0,
        width: 150,
        editable: true,
        required: true
    });
	
	$("#zuoqiId").combobox({
		url: "/zuoqi/selectAll",
		valueField: "id",
		textField: "name",
		width: 150,
		editable: true,
		panelHeight: "auto",
		formatter: function(row) {
			ajaxGet("/zuoqi_category/selectById", {
				id: row.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#zuoqi_" + row.id).attr({
					title: data.name,
					src: data.image,
					alt: data.name
				});
			}, error);
			
			return "<img width='18' id='zuoqi_" + row.id + "'/>" + row.name;
		}
	});

	$("#roleId").combogrid({
		url: "/role_account/selectAll",
		idField: "id",
		textField: "name",
		width: 150,
		required: true,
		panelWidth: 560,
		panelHeight: "auto",
		columns:[[
			{field: "id", title: "角色ID", align: "center", width:100},
			{field: "name", title: "角色名", align: "center", width: 120},
			{field: "categoryId", title: "角色造型", align: "center", width: 80
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/role_category/selectById", {
						id: value
					}, function(resp) {
						let data = resp.data;

						$("#modeling_" + rowIndex).attr({
							title: data.name,
							src: data.image,
							alt: data.name
						});
					}, error);

					return "<img width='" + size + "' id='modeling_" + rowIndex + "' />";
				}
			},
			{field: "grade", title: "等级", align: "center", width: 80},
			{field: "schoolId", title: "门派", align: "center", width: 80
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/school/selectById", {
						id: value
					}, function(resp) {
						let data = resp.data;

						$("#role_school_" + rowIndex).attr({
							title: data.name,
							src: data.image,
							alt: data.name
						});
					}, error);

					return "<img width='" + size + "' id='role_school_" + rowIndex + "' />";
				}
			}
		]]
	});
	
	$("#wenshi_dialog").dialog({
		title: "纹饰信息",
		width: 500,
		height: 300,
		buttons: [{
			iconCls: "icon-save",
			text: "保存",
			handler: function() {
				let selector = "#wenshi_form";

				checkForm(selector, function () {
					let data = $(selector).serialize();

					ajaxPost(requestUrl, data, function(resp) {
						showMsg(resp.message);

						$(selector).form("clear");
						$("#wenshi_dialog").dialog("close");
						$("#wenshi_list").datagrid("reload");
					}, error);
				});
			}
		}, {
			iconCls: "icon-cancel",
			text: "取消",
			handler: function() {
				$("#wenshi_form").form("clear");
				$("#wenshi_dialog").dialog("close");
			}
		}]
	});

	/******************************************************************************************************/
	
	$("#property_list").datagrid({
		url: "/wenshi_attribute/selectByWenshiId",
		method: "get",
		title: "纹饰属性列表",
		width: 456,
		height: 300,
		onAfterEdit: function (rowIndex, rowData, changes) { // 结束行内编辑事件
			data = {
				id: rowData.id,
				wenshiId: rowData.wenshiId,
				attributeId: changes.attributeId ? changes.attributeId : rowData.attributeId
			};
		},
		toolbar: [{
			iconCls: "icon-add",
			text: "添加",
			handler: function() {
				let datagrid = $("#property_list");
				let rowData = $("#wenshi_list").datagrid("getSelected");

				if(rowData) {
					requestUrl = "/wenshi_attribute/insert";

					datagrid.datagrid("appendRow",{
						wenshiId: rowData.id,
						attributeId: ""
					});

					let total = datagrid.datagrid("getRows").length;

					editingId = total - 1;

					datagrid.datagrid("beginEdit", editingId);
				} else {
					unselected("请选择一件器灵~");
				}
			}
		}, "-", {
			iconCls: "icon-edit",
			text: "修改",
			handler: function() {
				let datagrid = $("#property_list");

				if (editingId != null) {
					datagrid.datagrid("selectRow", editingId);
				} else {
					let row = datagrid.datagrid("getSelected");

					if (row) {
						// 获取行索引，这个索引从0开始
						let rowIndex = datagrid.datagrid("getRowIndex", row);

						editingId = rowIndex;
						requestUrl = "/wenshi_attribute/updateById";

						datagrid.datagrid("beginEdit", rowIndex);

						let $editor_ = datagrid.datagrid("getEditor", {
							index: editingId,
							field: "attributeId"
						});

						let rowData = $("#wenshi_list").datagrid("getSelected");

						ajaxGet("/wenshi_category/selectById", {
							id: rowData.categoryId
						}, function (resp) {
							let data = resp.data;

							$($editor_.target).combobox("reload", {
								wenshiId: data.type
							});
						}, error);
					}
				}
			}
		}, "-", {
			iconCls: "icon-save",
			text: "保存",
			handler: function() {
				if (editingId != null) {
					// 只有结束编辑才能获取到最新的值
					$("#property_list").datagrid("endEdit", editingId);

					ajaxPost(requestUrl, data, function(resp) {
						editingId = null;
						showMsg(resp.message);

						$("#property_list").datagrid("reload");
					}, error);
				}
			}
		}, "-", {
			iconCls: "icon-cancel",
			text: "取消",
			handler: function() {
				if (editingId != null) {
					$("#property_list").datagrid("cancelEdit", editingId);

					editingId = null;
				}
			}
		}, "-", {
			iconCls: "icon-delete",
			text: "删除",
			handler: function() {
				let rowData = $("#property_list").datagrid("getSelected");

				if(rowData) {
					$.messager.confirm("提示", "是否确认删除？", function(bool) {
						if (bool) {
							ajaxGet("/wenshi_attribute/deleteById", {
								id: rowData.id
							}, function(resp) {
								showMsg(resp.message);

								$("#property_list").datagrid("reload");
							}, error);
						}
					});
				} else {
					alertMsg("请选择要删除的记录！", "warning");
				}
			}
		}],
		columns: [[
			{field: "id", hidden: true},
			{field: "wenshiId", hidden: true},
			{field: "attributeId", title: "纹饰属性", align: "center", width: 150
				, editor: {
					type: "combobox",
					options: {
						url: "/wenshi_view_attribute/selectByWenshiId",
						valueField: "id",
						textField: "name",
						width: 180,
						editable: true,
						panelHeight: "auto"
					}
				}
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/wenshi_view_attribute/selectNameById", {
						id: value
					}, function(resp) {
						$("#attribute_" + rowIndex).html(resp.data);
					}, error);

					return "<div class='blue' id='attribute_" + rowIndex + "'></div>";
				}
			}
		]]
	});

	$("#property_dialog").dialog({
		title: " ",
		width: 470,
		height: 340
	});

	/******************************************************************************************************/

	$("#wenshi_detail .splitter").textbox({
		width: 200
	});

	$(".wenshi_bg").css({
		"width": "62px",
		"height": "62px",
		"border": "1px white solid"
	});

	$("#wenshi_detail").dialog({
		title: " ",
		width: 220
	});

	/******************************************************************************************************/

	let pageList = [10, 20, 50, 100];
	/**
	 * 表格体的高度
	 * @type {number}
	 */
	let heigt_body = heigt_tr_with_role_details * 10;
	/**
	 * 表格高度
	 * @type {number}
	 */
	let height_table = heigt_tool + heigt_header + heigt_filter + heigt_body + heigt_footer + heigt_scoll_bar + 2;

	let datagrid = $("#wenshi_list").datagrid({
		url: "/wenshi/selectByPage",
		method: "get",
		height: height_table,
		fitColumns: true,
		pagination: true,
		pageList: pageList,
		pageSize: pageList[0],
		remoteFilter: true,
		clientPaging: false,
		toolbar: [{
			iconCls: "icon-add",
			text: "添加",
			handler: function() {
				addHandler();
			}
		}, "-", {
			iconCls: "icon-edit",
			text: "修改",
			handler: function() {
				editHandler();
			}
		}, "-", {
			iconCls: "icon-ok",
			text: "克隆",
			handler: function() {
				cloneHandler();
			}
		}, "-", {
			iconCls: "icon-shield",
			text: "属性",
			handler: function() {
				attributeHandler();
			}
		}, "-", {
			iconCls: "icon-search",
			text: "预览",
			handler: function() {
				viewHandler();
			}
		}, "-", {
			iconCls: "icon-delete",
			text: "删除",
			handler: function() {
				deleteHandler();
			}
		}],
		columns: [[
			{field: "categoryId", title: "纹饰类型", align: "center", width: 160
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/wenshi_category/selectById", {
						id: value
					}, function(resp) {
						let data = resp.data;

						$("#category_" + rowIndex).attr({
							title: data.name,
							src: data.image,
							alt: data.name
						});
					}, error);
					
					return "<img height='" + size + "' id='category_" + rowIndex + "' />";
				}
			},
			{field: "durability", title: "耐久", align: "center", width: 160},
			{field: "inlayStatus", title: "镶嵌状态", align: "center", width: 160
				, formatter: function(value) {
					return statusArray[value];
				}
			},
			roleDetailsColumn
		]]
	});

	datagrid.datagrid("enableFilter", [{
		field: "categoryId",
		type: "combobox",
		options: {
			url: "/wenshi_category/selectAll",
			valueField: "id",
			textField: "name",
			editable: true,
			panelHeight: "auto",
			formatter: function(row) {
				return "<img width='18' src='" + row.image + "' />&nbsp;" + row.name;
			}
		},
		operator: ["equal", "notequal"]
	}, {
		field: "zuoqiId",
		type: "combobox",
		options: {
			url: "/zuoqi/selectAll",
			valueField: "id",
			textField: "name",
			panelHeight: "auto",
			formatter: function(row) {
				ajaxGet("/zuoqi_category/selectById", {
					id: row.categoryId
				}, function(resp) {
					let data = resp.data;

					$("#_zuoqi_" + rowIndex).attr({
						"alt": data.name,
						"src": data.image,
						"title": data.name
					});
				}, error);

				return "<img width='18' id='_zuoqi_" + row.id + "'/>" + row.name;
			}
		},
		operator: ["equal", "notequal"]
	}, {
		field: "roleId",
		type: "combobox",
		options: {
			url: "/role_account/selectAll",
			valueField: "id",
			textField: "name",
			panelHeight: "auto",
			formatter: function(row) {
				ajaxGet("/role_category/selectById", {
					id: row.categoryId
				}, function(resp) {
					let data = resp.data;

					$("#role_modeling_" + row.id).attr({
						"alt": data.name,
						"src": data.image,
						"title": data.name
					});
				}, error);

				return "<img width='18' id='role_modeling_" + row.id + "' />&ensp;" + row.name;
			}
		},
		operator: ["equal", "notequal"]
	}]);

});